<template>

	<div>
		<h1>图片列表</h1>

		<p>用户id：{{id}}</p>
		<p>用户电话：{{phone}}</p>

		<div class="imglist">
			<div class="img-item" v-for="(item,index) in imgData" :key="index">
				<img :src="item" />
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				id: '',
				type: "",
				imgData: [],
				phone: ''
			}
		},
		created() {
			this.id = this.$route.query.id;
			console.log(this.id)

			this.api.get('/api/choose', {
				id: this.id
			}).then(res => {
				this.imgData = JSON.parse(res.data.picture);
				this.phone = res.data.phone
			})
		}
	}
</script>

<style scoped>
	.imglist {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
	}

	.img-item {
		margin: 0 10px;
		width: 100px;
		height: 100px;
	}

	img {
		object-fit: cover;
		max-height: 100%;
		max-width: 100%;
		width: 100%;
		height: 100%;
	}
</style>
